<template>
	<!-- 品牌专区 -->
	<view class="Jfactory_wp">
		<view class="Jfactory_lists" v-for="items in Jinfo">
			<image :src="items.thumb" mode="widthFix" @click="$navTo(items.url)"></image>
			<view class="Jfactory_list_items">
				<view class="Jfactory_list_item_shop" v-for="item in items.childen" @click="$navTo('../shoplist/shopgoods?id='+item.id)">
					<image :src="item.thumb" mode=""></image>
					<view class="Jfactory_list_item_name clamp2">
						{{item.title}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default{
	props:{
		Jinfo:{
			type:Array,
			default:()=>[]
		}
	},
	methods:{
		// 标题截取
		
	}
}
</script>

<style>
.Jfactory_wp{
	padding: 0 20upx;
	position: relative;
}
.Jfactory_lists{
	position: relative;
	padding-bottom: 20upx;
}
.Jfactory_lists>image{
	border-radius: 10upx;
	width: 100%;
	will-change: transform;
}
.Jfactory_list_items{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.Jfactory_list_item_shop{
	background-color: #fff;
	border-radius: 20upx;
	width: calc(100% / 3 - 4%);
	margin-top: 20upx;
}
.Jfactory_list_item_shop:nth-of-type(3n + 2){
	margin: 20upx 6% 0;
}
.Jfactory_list_item_shop image{
	border-radius: 20upx;
	height: 220upx;
	width: 100%;
}
.Jfactory_list_item_name{
	height: 80upx;
	line-height: 40upx;
	padding:0 10upx;
}
</style>
